<template>
  <div>
    <!-- table -->
    <BreakSpace label="索赔结算单列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="columns"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'records'"
      :onColumnsChange="(columns) => (this.columns = columns)"
      :onCellChange="onCellChange"
      :isSelectColumn="false"
      :isPagination="false"
      height="auto"
    >
      <!--      <template slot="controls" slot-scope="props">-->
      <!--        <multiuse-button size="small" type="primary" icon="el-icon-plus" @click="jiesuandanadd()">添加</multiuse-button>-->
      <!--      </template>-->
    </FilterTable>
    <div style="padding-top: 3rem"></div>
    <BreakSpace label="发票信息列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="tableInvoice"
      :columns="columns1"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'records'"
      :onColumnsChange="(columns) => (this.columns = columns)"
      :onCellChange="onCellChange"
      :isSelectColumn="false"
      :isPagination="false"
      height="auto"
    >
      <!--      <template slot="controls" slot-scope="props">-->
      <!--        <multiuse-button size="small" type="primary" icon="el-icon-plus" @click="addInvoice()">添加</multiuse-button>-->
      <!--      </template>-->
    </FilterTable>
    <!--发票form-->
    <div style="padding-top: 3rem"></div>
    <FormPanel ref="formPanel" :list="formList" :cols="1" :formType="'add'" labelWidth="110" :isSubmitBtn="false" @formChange="formChangeHandle" />
    <BreakSpace label="索赔单列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table2"
      :columns="columns2"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'records'"
      :onColumnsChange="(columns) => (this.columns = columns)"
      :onCellChange="onCellChange"
      :isSelectColumn="false"
      :isPagination="false"
      height="auto"
    >
    </FilterTable>
    <div style="padding-top: 3rem"></div>
    <BreakSpace label="考核单列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table3"
      :columns="columns3"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'records'"
      :onColumnsChange="(columns) => (this.columns = columns)"
      :onCellChange="onCellChange"
      :isSelectColumn="false"
      :isPagination="false"
      height="auto"
    >
    </FilterTable>
    <div style="padding-top: 3rem"></div>
    <BreakSpace label="审核列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table4"
      :columns="columns4"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'items'"
      :onColumnsChange="(columns) => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      :is-select-column="false"
      :isPagination="false"
      height="auto"
    >
    </FilterTable>
    <!--快递form-->
    <div style="padding-top: 3rem"></div>
    <FormPanel ref="formPanel1" :list="formList1" :cols="3" :formType="'add'" labelWidth="110" :isSubmitBtn="false" @formChange="formChangeHandle1" />
    <div style="padding-top: 3rem"></div>
    <div style="padding-top: 3rem"></div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right',
      }"
    >
      <multiuse-button @click="closeDialog">关 闭</multiuse-button>
    </div>
    <BaseDialog :title="'查看附件'" :visible.sync="upVisible" destroyOnClose>
      <uploadFile :rowData="assessId" @close="upVisible = false"></uploadFile>
    </BaseDialog>
    <BaseDialog :visible.sync="jiesuandanFlag" :title="'结算单选择'" destroyOnClose width="850px" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <SelectClaimStatement @close="jiesuandanClose" @save="jiesuandanSave"></SelectClaimStatement>
    </BaseDialog>
    <BaseDialog :visible.sync="invoiceShow" :title="'添加发票'" destroyOnClose width="850px" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <addInvoice @close="closeAddInvoice" @save="saveAddInvoice"></addInvoice>
    </BaseDialog>
  </div>
</template>
<script>
//索赔结算单选择
//选择结算单之后回带索赔单和考核单信息
import { isFormEmpty } from '@/utils/index';
import { quyrpBatch } from '@/api/claim/factory/ClaimInvoiceCheck';
import uploadFile from './uploadFile';
export default {
  props: ['rowData'],
  components: {
    uploadFile
  },
  data() {
    return {
      editRow: {},
      dataList: [],
      dataList1: [],
      visible: false,
      jiesuandanFlag: false,
      visibleDrawer: false,
      collapse: false,
      infoId: null,
      flterValue: {}, //参数
      columns: this.creatHeader(),
      columns1: this.creatHeader1(),
      columns2: this.creatHeader2(),
      columns3: this.creatHeader3(),
      columns4: this.creatHeader4(),
      fetchParams: {}, //ipa 接口
      selectedRows: [], //选中经销商
      formList: this.createFormList(),
      formList1: this.createFormList1(),
      saveData: null,
      activeName: '审核记录',
      saveData1: {},
      invoiceShow: false,
      delInvoiceIds: '',
      upVisible:false,
      assessId:null
    };
  },
  created() {
    this.getDetailFun(this.rowData.batchId);
  },
  methods: {
    async getDetailFun(val) {
      let res = await quyrpBatch(val);
      this.editRow = res.data;
      //发票form赋值
      for (let i in res.data) {
        this.formList.map((x) => {
          if (x.fieldName == i) {
            x.initialValue = res.data[i];
          }
        });
      }
      //快递form赋值
      for (let i in res.data) {
        this.formList1.map((x) => {
          if (x.fieldName == i) {
            x.initialValue = res.data[i];
          }
        });
      }

      //为table赋值(索赔单)
      if (200 == res.resultCode) {
        let data = res.data;
        if (isFormEmpty(data)) {
          data = {};
        }
        let records = data.settleList;
        if (isFormEmpty(records)) {
          records = [];
        }
        this.$refs.table.$refs.pageTable.EXECUTE_INSERT(records);
      }
      //为table赋值(索赔单)
      if (200 == res.resultCode) {
        let data = res.data;
        if (isFormEmpty(data)) {
          data = {};
        }
        let records = data.claimList;
        if (isFormEmpty(records)) {
          records = [];
        }
        this.$refs.table2.$refs.pageTable.EXECUTE_INSERT(records);
        this.$refs.table2.$refs.pageTable.list.map((x) => {
          if(x.ifPrice == '是'){
            x.finalSumAmount =x.priceAmount;
          }
        });
      }
      //为table赋值(考核单)
      if (200 == res.resultCode) {
        let data = res.data;
        if (isFormEmpty(data)) {
          data = {};
        }
        let records = data.assessList;
        if (isFormEmpty(records)) {
          records = [];
        }
        this.$refs.table3.$refs.pageTable.EXECUTE_INSERT(records);
      }
      //为table赋值(审核日志)tableInvoice
      if (200 == res.resultCode) {
        let data = res.data;
        if (isFormEmpty(data)) {
          data = {};
        }
        let records = data.logList;
        if (isFormEmpty(records)) {
          records = [];
        }
        this.$refs.table4.$refs.pageTable.EXECUTE_INSERT(records);
      }
      //为table赋值(发票)
      if (200 == res.resultCode) {
        let data = res.data;
        if (isFormEmpty(data)) {
          data = {};
        }
        let records = data.invoiceList;
        if (isFormEmpty(records)) {
          records = [];
        } else {
          records.map((x) => {
            x.invoiceMoney = x.settleAmount;
            x.invoiceAmout = x.invoiceAmount;
            x.submitDate = this.editRow.submitDate;
          });
        }
        console.log(records);
        this.$refs.tableInvoice.$refs.pageTable.EXECUTE_INSERT(records);

        //取出ids
        let ids1 = [];
        this.$refs.tableInvoice.$refs.pageTable.list.map((x) => {
          ids1.push(x.invoiceId);
        });
        let ids = '';
        ids1.map((x) => {
          ids += x + ',';
        });
        this.delInvoiceIds = ids;
        console.log(this.delInvoiceIds);
      }
    },
    addInvoice() {
      this.invoiceShow = true;
    },
    jiesuandanadd() {
      this.jiesuandanFlag = true;
    },
    saveAddInvoice(invoice) {
      let list = [];
      list.push(invoice);
      this.$refs.tableInvoice.$refs.pageTable.EXECUTE_INSERT(list);
      this.invoiceShow = false;
    },
    closeAddInvoice() {
      this.invoiceShow = false;
    },
    onCellChange(columns, row) {
      let sum = 0;
      this.$refs.table.$refs.pageTable.list.map((x) => {
        console.log(x);
        sum += Number(x.pestructionCount);
      });
      console.log(sum);
      this.formList.find((x) => x.fieldName == 'destoryCount').initialValue = sum;
      this.formList.find((x) => x.fieldName == 'cmsClaimCount').initialValue = this.$refs.table.$refs.pageTable.list.length;
    },

    jiesuandanClose() {
      this.jiesuandanFlag = false;
    },
    //结算单新增
    async jiesuandanSave(val) {
      this.$refs.table.$refs.pageTable.EXECUTE_INSERT(val);
      this.jiesuandanFlag = false;
      //准备一个容器
      let settleIds = '';
      this.$refs.table.$refs.pageTable.list.map((x) => {
        settleIds += x.settleId + ',';
      });
      let resClaim = await SelectClaimBySettleIds(settleIds);
      let resAsses = await SelectAssesBySettleIds(settleIds);
      //为table赋值(索赔单)
      let records2 = resClaim.data;
      if (isFormEmpty(records2)) {
        records2 = [];
      }
      this.$refs.table2.$refs.pageTable.EXECUTE_DELETE(this.$refs.table2.$refs.pageTable.list);
      this.$refs.table2.$refs.pageTable.EXECUTE_INSERT(records2);

      //为table赋值(考核单)
      let records = resAsses.data;
      if (isFormEmpty(records)) {
        records = [];
      }
      this.$refs.table3.$refs.pageTable.EXECUTE_DELETE(this.$refs.table3.$refs.pageTable.list);
      this.$refs.table3.$refs.pageTable.EXECUTE_INSERT(records);

      // let res= await quyrPSettle(val);
    },
    formChangeHandle(val) {
      this.saveData = val;
    },
    formChangeHandle1(val) {
      this.saveData1 = val;
    },
    //搜索获取数据
    changeHandle(val) {
      this.fetchParams = val;
    },
    //选中
    selectChange(rows) {
      this.selectedRows = rows;
      console.log(this.selectedRows);
    },

    async fapiaodeleteFun(row) {
      this.$refs.tableInvoice.$refs.pageTable.EXECUTE_DELETE([row]);
    },
    async deleteHandle(row) {
      this.$refs.table.$refs.pageTable.EXECUTE_DELETE([row]);
      if (this.$refs.table.$refs.pageTable.list.length == 0) {
        this.$refs.table2.$refs.pageTable.EXECUTE_DELETE(this.$refs.table2.$refs.pageTable.list);
        this.$refs.table3.$refs.pageTable.EXECUTE_DELETE(this.$refs.table3.$refs.pageTable.list);
      } else {
        //准备一个容器
        let settleIds = '';
        this.$refs.table.$refs.pageTable.list.map((x) => {
          settleIds += x.settleId + ',';
        });
        let resClaim = await SelectClaimBySettleIds(settleIds);
        let resAsses = await SelectAssesBySettleIds(settleIds);
        //为table赋值(索赔单)
        let records2 = resClaim.data;
        if (isFormEmpty(records2)) {
          records2 = [];
        }
        this.$refs.table2.$refs.pageTable.EXECUTE_DELETE(this.$refs.table2.$refs.pageTable.list);
        this.$refs.table2.$refs.pageTable.EXECUTE_INSERT(records2);
        //为table赋值(考核单)
        let records = resAsses.data;
        if (isFormEmpty(records)) {
          records = [];
        } //先清除 再重新插入
        this.$refs.table3.$refs.pageTable.EXECUTE_DELETE(this.$refs.table3.$refs.pageTable.list);
        this.$refs.table3.$refs.pageTable.EXECUTE_INSERT(records);
      }
    },
    //保存
    async saveDialog() {
      this.$refs.formPanel.SUBMIT_FORM();
      this.$refs.formPanel1.SUBMIT_FORM();
      let settleIds = '';
      this.$refs.table.$refs.pageTable.list.map((x) => {
        settleIds += x.settleId + ',';
      });
      this.saveData.settleIds = settleIds;
      this.saveData = Object.assign(this.saveData, this.saveData1);
      let arr = [];
      this.$refs.tableInvoice.$refs.pageTable.list.map((x) => {
        delete x.isDeleted;
        delete x.invoiceId;
        arr.push(x);
      });
      console.log(arr);
      //发票table
      this.saveData.invoiceList = arr;
      for (let a in this.editRow) {
        if (this.saveData[a]) {
          this.editRow[a] = this.saveData[a];
        }
      }
      this.editRow.delInvoiceIds = this.delInvoiceIds;
      if (this.saveData && this.saveData.invoiceList.length) {
        let res = await editSave(this.editRow);
        if (res.resultCode === 200) {
          this.closeDialog('refresh');
          return this.$notify.success({ title: '提示信息', message: '保存成功' });
          this.$emit('save');
        } else {
          this.$notify.error({ title: '提示信息', message: res.errMsg || '保存失败!' });
          this.closeDialog();
        }
      } else {
        return this.$notify.warning({ title: '提示信息', message: '有未校验通过的信息' });
      }
    },

    //取消操作
    closeDialog() {
      this.$emit('close');
    },
    chooseOrderNo() {
      this.visible = true;
    },
    editFile(row){
      this.upVisible = true;
      this.assessId = row.assessId;
    },
    createFormList() {
      return [
        {
          type: 'TEXT_AREA',
          label: '开票备注',
          fieldName: 'invoiceRemarks',
          initialValue: '',
          disabled: true,
          placeholder: '请输入开票备注...',
        },
        {
          type: 'TEXT_AREA',
          label: '邮寄说明',
          fieldName: 'expressRemarks',
          initialValue: '',
          disabled: true,
          placeholder: '请输入邮寄说明...',
        },
        // {
        //   type: 'UPLOAD_FILE',
        //   label: '选择文件',
        //   fieldName: 'fileList',
        //   placeholder: '选择文件...',
        //   initialValue: [{ name: 'food.jpeg', fileId: '11',url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' }],
        //   upload: {
        //     actionUrl: '/api/file/oss/upload',
        //     limit: 2,
        //     tipText: '（支持PDF、RAR、JPG格式）'
        //   }
        // }
      ];
    },
    //table表头和数据源
    creatHeader() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: (props) => {
            return <span>{props.row.index + 1}</span>;
          },
        },
        // {
        //   title: '操作',
        //   dataIndex: 'column-action',
        //   width: 100,
        //   render: (props) => {
        //     return (
        //       <div style="text-align:center">
        //       <multiuse-button size="mini" type="text" onClick={() => this.deleteHandle(props.row)}>
        //     删除
        //     </multiuse-button>
        //     </div>
        //   );
        //   },
        // },
        { title: '经销商代码', dataIndex: 'ownerCode', sorter: true },
        { title: '经销商名称', dataIndex: 'dealerName', sorter: true },
        { title: '结算单号', dataIndex: 'settleNo', sorter: true },
        { title: '索赔单数', dataIndex: 'claimCount', sorter: true },
        { title: '索赔金额', dataIndex: 'claimAmount', sorter: true },
        { title: '结算金额', dataIndex: 'settleAmount', sorter: true },
        { title: '考核金额', dataIndex: 'assessAmount', sorter: true },
        { title: '开票时间', dataIndex: 'createdAt', sorter: true },
      ];
    },
    creatHeader1() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: (props) => {
            return <span>{props.row.index + 1}</span>;
          },
        },
        // {
        //   title: '操作',
        //   dataIndex: 'column-action',
        //   width: 100,
        //   render: (props) => {
        //     return (
        //       <div style="text-align:center">
        //       <multiuse-button size="mini" type="text" onClick={() => this.fapiaodeleteFun(props.row)}>
        //     删除
        //     </multiuse-button>
        //     </div>
        //   );
        //   },
        // },
        { title: '发票号', dataIndex: 'invoiceNo', sorter: true },
        { title: '开票金额', dataIndex: 'invoiceAmout', sorter: true, summation: true,precision:2 },
        { title: '税率', dataIndex: 'taxRate', sorter: true, summation: true,precision:2 },
        { title: '金额', dataIndex: 'invoiceMoney', sorter: true, summation: true,precision:2 },
        { title: '税额', dataIndex: 'taxAmount', sorter: true, summation: true,precision:2 },
        { title: '开票时间', dataIndex: 'submitDate', sorter: true },
      ];
    },
    //开票备注和附件
    createFormList1() {
      return [
        {
          type: 'INPUT',
          label: '快递单号',
          disabled: true,
          fieldName: 'expressNo',
        },
        {
          type: 'INPUT',
          label: '厂家收票人',
          disabled: true,
          fieldName: 'oemCol',
        },
        {
          type: 'INPUT',
          label: '收票地址',
          disabled: true,
          fieldName: 'oemAddress',
        },
        {
          type: 'INPUT',
          label: '开票信息',
          disabled: true,
          fieldName: 'invoiceInfo',
        },
        {
          type: 'INPUT',
          label: '其他提示',
          disabled: true,
          fieldName: 'otherRemarks',
        },
      ];
    },

    //索赔单列表
    creatHeader2() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: (props) => {
            return <span>{props.row.index + 1}</span>;
          },
        },
        // {
        //   title: '操作',
        //   dataIndex: 'column-action',
        //   width: 100,
        //   fixed: 'left',
        //   render: props => {
        //     return (
        //       <div style="text-align:center">
        //       <multiuse-button type="primary" icon="el-icon-delete" circle onClick={() => this.deleteFunsuopei(props.row)} />
        //     </div>
        //   );
        //   }
        // },
        { title: '经销商代码', dataIndex: 'ownerCode', sorter: true },
        { title: '经销商名称', dataIndex: 'ownerName', sorter: true },
        { title: '索赔单号', dataIndex: 'claimNo', sorter: true },
        { title: '维修工单号', dataIndex: 'roNo', sorter: true },
        { title: 'VIN', dataIndex: 'vin', sorter: true },
        { title: '主损件代码', dataIndex: 'partCode', sorter: true },
        { title: '主损件名称', dataIndex: 'partName', sorter: true },
        { title: '维修开始时间', dataIndex: 'serviceBeginDate', sorter: true },
        { title: '结算单生成时间', dataIndex: 'settleDate', sorter: true },
        { title: '车型名称', dataIndex: 'modelName', sorter: true },
        { title: '索赔类型', dataIndex: 'cmsClaimTypeStr', sorter: true },
        { title: '是否一口价', dataIndex: 'ifPrice', sorter: true },
        { title: '工时费', dataIndex: 'labourFinalPrice', sorter: true },
        { title: '配件费', dataIndex: 'partrFinalPrice', sorter: true },
        { title: '附加费用', dataIndex: 'addFinalPrice', sorter: true },
        { title: '索赔金额', dataIndex: 'finalSumAmount', sorter: true },
        { title: '审核时间', dataIndex: 'checkAt', sorter: true },
        { title: '审核人', dataIndex: 'checkBy', sorter: true },
        { title: '主键', dataIndex: 'claimId', hidden: true },
      ];
    },
    //考核单列表
    creatHeader3() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: (props) => {
            return <span>{props.row.index + 1}</span>;
          },
        },
        {
          title: '操作',
          dataIndex: 'column-action',
          width: 90,
          render: props => {
            return (
              <div style="text-align:center">
                <multiuse-button type="text" onClick={() => this.editFile(props.row)} >
                  查看附件
                </multiuse-button>
              </div>
            );
          }
        },
        { title: '考核单号', dataIndex: 'assessNo', sorter: true },
        { title: '考核类型', dataIndex: 'assessTypeStr', sorter: true },
        { title: '考核金额', dataIndex: 'assessAmount', sorter: true },
        { title: '考核原因', dataIndex: 'assessReason', sorter: true },
        { title: '考核日期', dataIndex: 'assessDate', sorter: true },
        { title: '考核人', dataIndex: 'assessByStr', sorter: true },
        { title: '主键', dataIndex: 'assessId', hidden: true },
      ];
    }, //考核单列表
    creatHeader4() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: (props) => {
            return <span>{props.row.index + 1}</span>;
          },
        },
        { title: '审核人', dataIndex: 'checkBy', sorter: true },
        { title: '审核时间', dataIndex: 'checkAt', sorter: true },
        { title: '审核状态', dataIndex: 'statusStr', sorter: true },
        { title: '审核原因', dataIndex: 'checkRemarks', sorter: true },
      ];
    },
  },
};
</script>

<style lang="less" scoped></style>
